<!DOCTYPE html>
<html lang="en">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="renderer" content="webkit" />
    <title>客易达商城管理系统</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            font-family: 'Microsoft Yahei';
        }

        .ie-a {
            color: #eee;
            font-size: 14px;
            text-decoration: none;
        }

        html,
        body {
            margin: 0;
            padding: 0;
            width: 100%;
            height: 100%;
            overflow: hidden;
        }

        img {
            border: 0;
        }

        .ie-a p {
            line-height: 40px;
        }

        .ie-1-4-box {
            width: 25%;
            margin: 0;
            padding: 0;
            text-align: center;
            float: left;
        }

        .ie-center {
            width: 900px;
            margin: 0 auto;
        }

        .ie-center p {
            width: 100%;
            font-size: 20px;
            color: #fff;
        }
    </style>
</head>

<body>
    <div id="ie-box" style="
                width: 100%;
                height: 100%;
                background: url('./assets/ie-bg.png') repeat-x;
                margin: 0;
                padding: 0 0 0 0;
            ">
        <center class="ie-center">
            <p style="margin-top: 0px">
                您的浏览器版本过低，请升级您的浏览器
            </p>
            <p>我们建议您下载以下浏览器的最新版本，以获得更好体验</p>
            <p>
                如果您使用的是360、QQ、搜狗等浏览器，请在网址右侧切换到极速模式
            </p>
            <div class="ie-bg">
                <div style="
                            padding: 110px 100px 0 100px;
                            display: inline-block;
                        ">
                    <div class="ie-1-4-box">
                        <a class="ie-a" href="https://www.google.cn/chrome/" target="_blank">
                            <img src="./assets/chrome.png" style="width: 50%" />
                            <p>Google Chrome</p>
                            <p>（强烈建议）</p>
                        </a>
                    </div>
                    <div class="ie-1-4-box">
                        <a class="ie-a" href="http://www.firefox.com.cn/" target="_blank">
                            <img src="./assets/firefox.png" style="width: 50%" />
                            <p>Mozilla FireFox</p>
                        </a>
                    </div>
                    <div class="ie-1-4-box">
                        <a class="ie-a" href="http://www.oupeng.com/download/" target="_blank">
                            <img src="./assets/opera.png" style="width: 50%" />
                            <p>Opera</p>
                        </a>
                    </div>
                    <div class="ie-1-4-box">
                        <a class="ie-a" href="https://www.apple.com/cn/safari/" target="_blank">
                            <img src="./assets/safari.png" style="width: 50%" />
                            <p>Apple Safari</p>
                        </a>
                    </div>
                </div>
                <div style="clear: both"></div>
            </div>
        </center>
    </div>

    <script>
        var H = document.body.clientHeight;
        var paddingTop = (H - 455) * 0.5;
        if (paddingTop < 0) {
            paddingTop = 0;
        }
        document.getElementById('ie-box').style.cssText =
            'width:100%;height:' +
            H +
            "px;background:url('./assets/ie-bg.png') repeat-x;margin:0;padding:" +
            paddingTop +
            'px 0 0 0;';
    </script>
</body>

</html>